<template>
    <div>
        <ul class="recursive-ul">
            <li>
                <div class="item">
                    <p>什么舞么问问显示设计费大是大非</p>
                    <p>
                        <span>4条</span>
                        <x-icon type="ios-arrow-right"
                                size="20"
                                fill="#999"></x-icon>
                        <x-icon type="ios-arrow-down"
                                size="20"
                                fill="#999"></x-icon>
                    </p>
                </div>
                <ul class="recursive-ul">
                    <li>
                        <div class="item">
                            <p>什么舞么问问显示设计费大是大非</p>
                            <p>
                                <span>4条</span>
                                <x-icon type="ios-arrow-right"
                                        size="20"
                                        fill="#999"></x-icon>
                            </p>
                        </div>
                        <ul class="recursive-ul">
                            <li>
                                <router-link to=""
                                             class="item">
                                    <p>什么舞么问问显示设计费大是大非</p>
                                    <p>
                                        <span>4条</span>
                                    </p>
                                </router-link>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li>
                <div class="item">
                    <p>什么舞么问问显示设计费大是大非</p>
                    <p>
                        <span>4条</span>
                        <x-icon type="ios-arrow-right"
                                size="20"
                                fill="#999"></x-icon>
                        <x-icon type="ios-arrow-down"
                                size="20"
                                fill="#999"></x-icon>
                    </p>
                </div>
                <ul class="recursive-ul">
                    <li>
                        <div class="item">
                            <p>什么舞么问问显示设计费大是大非</p>
                            <p>
                                <span>4条</span>
                                <x-icon type="ios-arrow-right"
                                        size="20"
                                        fill="#999"></x-icon>
                            </p>
                        </div>
                        <ul class="recursive-ul">
                            <li>
                                <div class="item">
                                    <p>什么舞么问问显示设计费大是大非</p>
                                    <p>
                                        <span>4条</span>
                                        <x-icon type="ios-arrow-right"
                                                size="20"
                                                fill="#999"></x-icon>
                                    </p>
                                </div>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
    name: 'notCorrected'
}
</script>
<style scoped>
.recursive-ul .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 20px;
    padding-left: 20px;
    border-bottom: 1px solid #f4f4f4;
}
.item + .recursive-ul {
    padding-left: 20px;
}
.recursive-ul p {
    line-height: 40px;
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #333;
}
.recursive-ul span {
    color: #999;
}
</style>
